<template>
  <el-dialog
    :title="isEdit? '修改' : '添加'"
    :visible.sync="dialogData.dialogVisible"
    width="950px"
    @close="closeDialog"
    @open="openDialog"
    :close-on-click-modal="false"
  >
    <el-form ref="form" :model="list" :rules="rules" label-width="150px">
      <el-form-item label="问题：" class="inlineCt" prop="title">
        <el-input v-model="list.title" class="input260" placeholder="请输入问题"/>
      </el-form-item>
      <el-form-item label="推送对象(可多选)：" class="inlineCt" prop="type">
        <el-checkbox-group v-model="list.type">
          <el-checkbox label="1">会员</el-checkbox>
          <el-checkbox label="2">品牌商</el-checkbox>
          <el-checkbox label="3">服务商</el-checkbox>
          <el-checkbox label="4">城市分站</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="回答：" prop="content">
        <tinymce ref="tinymce" v-model="list.content"  :isEdit="isEdit" :width="720" :addNum="addNum"/>
      </el-form-item>
      <el-form-item>
        <el-button @click="closeDialog">取消</el-button>
        <el-button @click="onSubmit('form')" type="primary">确定</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<script>
  import * as api from '@/api/platform-setup'

  const defaultList = {
    title: '',
    type: [],
    content: ''
  }

  export default {
    name: 'Detail',
    components: {},
    props: {
      dialogData: {
        type: Object,
        default: function () {
          return {
            dialogVisible: false,
            value: '',
            id: ''
          }
        }
      },
      isEdit: {
        type: Boolean,
        default: true
      },
      addNum: {
        type: Number,
        default: 0
      }
    },
    data () {
      return {
        listLoading: false,
        defaultList,
        list: Object.assign({}, defaultList),
        rules: this.rules,
        dialogIsEdit: false
      }
    },
    methods: {
      /* 重置表单 */
      resetForm () {
        this.list = Object.assign({}, defaultList)
      },
      /* 关闭 */
      closeDialog () {
        this.dialogData.dialogVisible = false
        this.list = Object.assign({}, defaultList)
      },
      /* 打开 */
      openDialog () {
        if (this.isEdit) {
          this.list = JSON.parse(JSON.stringify(this.dialogData.value))
          this.list.type = this.list.pushObj.split(',')
        }else {
          this.list = Object.assign({}, defaultList)
        }
      },
      /* 提交 */
      onSubmit (formName) {
        this.listLoading = true
        let data = {
          title: this.list.title,
          content: this.list.content,
          pushObj:  this.list.type.join(",")
        }
        // 修改传id
        this.list.id !== undefined ? (data.id = this.list.id) : ''
        this.listLoading = true
        this.requestFuc
          .onSubmit({
            _that: this,
            formName,
            data,
            addFuc: api.helpAdd,
            updFuc: api.editHelp
          })
          .then(() => {
            this.$emit('getList')
            this.closeDialog()
            this.listLoading = false
          })
          .catch(() => {
            this.listLoading = false
          })
      }
    }
  }
</script>
<style scoped>
  #container {
    width: 700px;
    height: 400px;
    margin: 0 auto;
    margin-bottom: 20px;
  }

  * {
    touch-action: none;
  }
</style>

